html { 
  background: no-repeat center fixed; 
  background-size: cover;
  height:100%;
  width:100%;
}

.img ul{
  position:absolute;
  margin:0;
  padding:0;
}

.img li{
  text-align:center;
  display:inline-block;
  list-style:none;
  position:relative;
  border:solid 12px #fff;
  background:#fff;
  box-shadow:0 0 15px 0px #555;
}


.img li:hover{
  top:0px;
  opacity:0.5;
}

.img li:nth-child(1){
    transform:rotate(10deg);
}

.img li:nth-child(2){
    transform:rotate(0deg);
}

.img li:nth-child(3){
    transform:rotate(-10deg);
}

.img li:nth-child(4){
    transform:rotate(20deg);
}

p{
  margin:-5px 0 0 0;
}